<template>
<view class="page">
	<template v-if="isLogin">	 
		<view class="body">
			<template v-if="loadingState.default">
				<loading :loadingState="loadingState"></loading>
			</template>
			<template v-else>
				<view class="detail-wrap">
					<template v-if="list.length>0"> 
						<label class="check-item" v-for="(item,index) in list" :key="index">
							<view class="text">{{item.value}}</view> 
							<view></view>
						</label> 						
						<loading :loadingState="loadingState"></loading>
					</template>
					<template v-else>
						<empty msg="暂无信息"></empty>
					</template> 
				</view>
			</template>
		</view> 
		<view class="footer">
			<view class="fix-wrap">
				<navigator open-type="navigate" url="/package_yaoji/addYaoJiSpecs/addYaoJiSpecs" hover-class="none" class="add-yj-btn">添加规格</navigator>
			</view>
		</view>	 
	</template>
</view>
</template>

<script> 
import loading from '@/components/loading-more.vue'
import empty from '@/components/empty.vue' 
export default{
	name:'demo',
	data(){
		return{ 
			isLogin:false,
			loadingState:{
				default:true,
				loading:false,
				completed:false
			}, 
			page:1,
			total:0,
			list:[], 
		}
	},
	onShow() {
		
	},
	async onLoad() {
		this.isLogin = await this.$loginState('check');
		if(this.isLogin){  
			this.getSpecs();
		}
	},
	onReachBottom(){
		if(this.loadingState.completed){
			this.page=1;
			return false
		}else{
			if(this.list.length<this.total&&this.list.length>0){
				this.page++;
				this.getSpecs();
			} 
		}	 
	},
	methods:{
		 
		// 获取药剂规格
		getSpecs:async function(){
			let res=await this.$api.ycj_api.getAllSpecs();  
			if(res.data.ret==0){
				this.loadingState.default=false;
				res.data.data.forEach(item=>{
					let spec={}
					spec.id=item.id;
					spec.check=false;
					spec.value=item.unit_count+item.alias_name+'/'+item.pack_name;
					this.list.push(spec)
				})
			}
		} 
		
	},
	computed: {
		specs_update(){ 
			return this.$store.state.yjSpecsUpdate;
		}
	},
	watch: {
		specs_update(newer,older){
			if(newer!=older){
				this.list=[];
				this.getSpecs();
			}
		}
	},
	components:{
		loading,
		empty
	}
}
</script>

<style scoped lang="less">
	.detail-wrap{
		 
	}
	
	.add-yj-btn{ 
		width: 96%;
		height:80rpx;
		margin:10rpx auto;
		background: #f00;
		border-radius: 10rpx;
		text-align: center;
		line-height:80rpx;
		color:#fff;
		font-size:32rpx;
	}
</style>
